<template>
  <div class='container sort fx-h-c'>
      <Menu :menuList='menuList' :styles="styles" :i='i' @changeActiveIndex='changeActiveIndex'></Menu>
      <a href="" :style="styles">标签管理</a>
  </div>
</template>

<script>
import Menu from '@/components/common/Menu'
import { setSessionStorage, getSessionStorage } from "@/utils/utils";
export default {
  name: "Sort",
  components: {
      Menu
  },
  data() {
      return {
          menuList: [
              '推荐',
              '关注',
              '前端',
              '后端',
              'Android',
              "iOS",
              '人工智能',
              '开发工具',
              '代码人生',
              '阅读'
          ],
          styles: {
              "font-size": '1.2rem'
          },
          i: getSessionStorage('sortActiveIndex') || 0
      }
  },
   methods: {
    changeActiveIndex(i) {
      setSessionStorage('sortActiveIndex', i)
      this.i = i;
    }
  }
};
</script>

<style lang="scss" scoped>
.sort {
    height: 4.5rem;
    justify-content: space-between;
}
</style>